<template>
  <view class="allContaienr" @click="handleClick">
    <image class="itemImg" />
    <!-- <u-icon  slot="icon" size="100" name="file-text"></u-icon> -->
    <view class="itemContent" :style="{ width: itemContentWidth + 'px' }">
      <text class="itemName">{{ resumeSimpleName }}</text>
      <span class="itemTime">评定时间：{{ itemObj.createTime }}</span>
    </view>

    <view class="itemStatus" :style="{ color: textColor }">{{
      diagnoseStatusText
    }}</view>
  </view>
</template>

<script>
export default {
  props: {
    index: {
      type: Number,
      default: 0
    },

    itemObj: {
      type: Object,
      default: function () {
        return {
          diagnoseRecordId: '',
          resumeUrl: '',
          personId: '',
          resumeName: '',
          createTime: '',
          //是否解锁 1：未解锁 2:已解锁
          isLock: 1,
          // 0:未评定 1:评定中 2：已评定 3：评定失败
          diagnoseStatus: 0
        };
      }
    }
  },

  data() {
    return {
      screenHeight: 0,
      screenWidth: 0,
      itemContentWidth: 0,
      diagnoseStatus: '',
      textColor: '#ffffff',
      thisItem: {},
      resumeSimpleName: '',
      diagnoseStatusText: ''
    };
  },

  onReady() {
    let systemInfo = uni.getSystemInfoSync();
    this.screenHeight = systemInfo.windowHeight;
    this.screenWidth = systemInfo.windowWidth;
    this.itemContentWidth = this.screenWidth * 0.6;
  },

  watch: {
    itemObj: {
      handler(val) {
        this.thisItem = val;
        if (val.isLock == 2) {
          this.diagnoseStatus = '已解锁';
          // this.textColor = "#222222";
        } else {
          this.diagnoseStatus = '未解锁';
          // this.textColor = "#ff0000";
        }
        this.resumeSimpleName = this.thisItem.resumeName;
        // 0:未评定 1:评定中 2：已评定 3：评定失败
        if (this.thisItem.diagnoseStatus <= 1) {
          this.diagnoseStatusText = '评定中';
          this.textColor = '#ff9A54';
        } else if (this.thisItem.diagnoseStatus == 2) {
          this.diagnoseStatusText = '评定成功';
          this.textColor = '#70B603';
        } else if (this.thisItem.diagnoseStatus == 3) {
          this.diagnoseStatusText = '评定失败';
          this.textColor = '#AAAAAA';
        }
      },
      deep: true, // 深度监听
      immediate: true // 初始化的时候立刻执行一次
    }
  },
  methods: {
    handleClick() {
      uni.navigateTo({
        url: `/pagesSub/newResume/resumeAssessment/index?target=AIResumeDiagnoseNew`
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.allContaienr {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: white;
  padding-top: 20rpx;
  padding-bottom: 20rpx;
  padding-left: 16rpx;
  padding-right: 16rpx;
  margin-left: 16rpx;
  margin-right: 16rpx;
  margin-bottom: 20rpx;
  .itemImg {
    width: 50rpx;
    height: 50rpx;
    background-size: 100% 100%;
    background-image: url($img-base + 'career/diagnosis/icon_diagnosis_file.svg');
    // width: 20rpx;
    // height: 20rpx;
  }

  .fillObject {
    flex: 1;
  }

  .itemContent {
    display: flex;
    flex-direction: column;
    margin-left: 20rpx;
    .itemName {
      // width: 100%;
      overflow: hidden;
      word-break: break-all; /* break-all(允许在单词内换行。) */
      // text-overflow: ellipsis;  /* 超出部分省略号 */
      display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
      -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
      //-webkit-line-clamp: 3; /** 显示的行数 **/
    }

    .itemTime {
      margin-top: 10rpx;
    }
  }

  .itemStatus {
    flex: 1;
    text-align: right;
    font-size: 28rpx;
  }
}
</style>
